<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>聊天窗口</title>
	<meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <link rel="stylesheet" type="text/css" href="../easyui/themes/default/easyui.css">
	<script type="text/javascript" src="../easyui/jquery-1.6.min.js"></script>
	<script type="text/javascript" src="../easyui/jquery.easyui.min.js"></script>
	<script type="text/javascript" src="../easyui/locale/easyui-lang-zh_CN.js"></script>
	<script type="text/javascript" src="../javascript/tools.js"></script>
	
	<script type="text/javascript" charset="utf-8" src="../ueditor/editor_config.js"></script>
	<script type="text/javascript" charset="utf-8" src="../ueditor/editor_all.js"></script>
    <link rel="stylesheet" type="text/css" href="../ueditor/themes/default/ueditor.css"/>
    
	<STYLE>
	.tablestyle01{background-color:#E1EDF7;}
	.tablestyle01 td{ padding:3px 0px 3px 6px; border-bottom:1px dashed #ACB3B9; font-size:12px;}
	body {
		margin-left: 0px; margin-top: 0px;
		margin-bottom: 0px; margin-right: 1px;
	}
	</STYLE>
	<script type="text/javascript">
	$(function(){
		initEditPanel();
		$('#div_fenye').pagination({
			total:0,
			pageSize:12,
			pageNumber:1,
			pageList:[12],
			onSelectPage:function(pageNumber, pageSize){
				alert(pageNumber);
			}
		});
	});
	
	var editor_a = null;
	function initEditPanel(){
		var editorOption = {
			toolbars:[[ 'cleardoc', 'Undo', 'Redo','|','Bold','underline','fontfamily','fontsize','forecolor','indent',
				'justifyleft','justifycenter','justifyright',
				'|','emotion','insertimage','attachment']],
			autoClearinitialContent:true,//获到焦点后，去掉默认内容
			wordCount:false,//关闭字数统计
			maximumWords: 10000,//最大输入字数
			elementPathEnabled:false,//关闭elementPath
			minFrameHeight: 120,//高度
			autoHeightEnabled: false//是否自动随内容加大高度
		};
		editor_a = new baidu.editor.ui.Editor(editorOption);
		editor_a.render('myEditor1');	
		editor_a.setContent("");
	}
	
	
	var to_userid = "AAAAA";
	
	//发送信息
	function sendMsg(){
		if(!editor_a.hasContents()){
			alert("信息内容不能为空"); return false;
		}
		var message = editor_a.getContent();
		$.ajax({
			type: "POST",	url: "MessageServlet", data: {"message":message,"messageType":"p2p", "touserid":to_userid}, dataType: "text",
			success: function(text){
				//alert(text);
				editor_a.setContent("");
			},	
			error: function(e) {alert("信息发送失败");}
		});
	}
	
	function setBackgroundColor(div){
		if(div.style.backgroundColor=='#e1edf7'){
			div.style.backgroundColor = '';
		}else{
			div.style.backgroundColor = '#E1EDF7';
		}
	}
	
	function messageClick(div){
		editor_a.execCommand("inserthtml",div.innerHTML);
	}
	</script>
  </head>
  
  <body >
  	<div class="easyui-panel" title="聊天记录" noheader="true" style="height:200; ">
  		<div onclick="setBackgroundColor(this);" ondblclick="messageClick(this)">
  			<div style="color: blue;">某某某(24403001111) 2010-01-01 01:01:01</div>
  			<div style="padding-left: 10px;">随碟附送发达士大夫似的1</div>
  		</div>
  		<div onclick="setBackgroundColor(this);" ondblclick="messageClick(this)">
  			<div style="color: blue;">某某某(24403001111) 2010-01-01 01:01:01</div>
  			<div style="padding-left: 10px;">随碟附送发达士大夫似的2</div>
  		</div>
  		<div onclick="setBackgroundColor(this);" ondblclick="messageClick(this)">
  			<div style="color: blue;">某某某(24403001111) 2010-01-01 01:01:01</div>
  			<div style="padding-left: 10px;">随碟附送发达士大夫似的3</div>
  		</div>
  		<div onclick="setBackgroundColor(this);" ondblclick="messageClick(this)">
  			<div style="color: blue;">某某某(24403001111) 2010-01-01 01:01:01</div>
  			<div style="padding-left: 10px;">随碟附送发达士大夫似的4</div>
  		</div>
  	</div>
    <div id="div_fenye" style="background:#efefef;border:1px solid #ccc; width:100%; margin-bottom: 2px; "></div>
    
  	<div>
		<div>
			<script type="text/plain" id="myEditor1" style="width:529"></script>
		</div>
	</div>
	
	
	
	<div align="right" style="background:#efefef;border:1px solid #ccc; width:100%; padding-right: 1px; ">
		<a href="#" class="easyui-linkbutton" onclick="sendMsg();return false;">发送</a>
 		<a href="#" class="easyui-linkbutton" onclick="winClose();">关闭</a>
 		<!-- <a href="#" class="easyui-linkbutton" onclick="winReload();">刷新</a> -->
    </div>
  </body>
</html>
